import Vue from 'vue'
import Router from 'vue-router'
import Home from 'components/home/home'
import Find from 'components/home/find/find'
import Order from 'components/home/order/order'
import Take from 'components/home/take/take'
import Mine from 'components/home/mine/mine'
import Seller from 'components/seller/seller'
import GoodList from 'components/seller/goodList/goodList'

Vue.use(Router)

var router = new Router({
  // linkActiveClass属性是一个类名，表示的是当路由被激活的时候应用的是哪一个样式。
  linkActiveClass: 'active',
  routes: [
    {
      path: '/',
      // 重定向
      redirect: '/home/take'
    },
    {
      path: '/home',
      component: Home,
      children: [
        {
          path: 'take',
          name: 'take',
          component: Take,
          meta: {
            title: '首页'
          }
        },
        {
          path: 'order',
          name: 'order',
          component: Order,
          meta: {
            title: '订单'
          }
        },
        {
          path: 'mine',
          name: 'mine',
          component: Mine,
          meta: {
            title: '我的'
          }
        },
        {
          path: 'find',
          name: 'find',
          component: Find,
          meta: {
            title: '发现'
          }
        }
      ]
    },
    {
      path: '/seller',
      name: 'seller',
      component: Seller,
      children: [
        {
          path: 'goodList',
          name: 'goodList',
          component: GoodList
        }
      ]
    }
  ]
})
// 在路由跳转时将页面的标题设置为即将进入得路由的标题
router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    // to 将要进入得路由对象 from 要离开的路由
    document.title = to.meta.title
  }
  // next(): 进行管道中的下一个钩子。如果全部钩子执行完了，则导航的状态就是 confirmed （确认的）
  next()
})

export default router
